Typography

The Typography component makes it easy to apply a default set of font weights and sizes in your application. You can use the following utility classes.

Class

Description

.h1

font-size: 3.2rem

.h2

font-size: 2.8rem

.h3

font-size: 2.5rem

.h4

font-size: 2rem

.h5

font-size: 1.7rem

.h6

font-size: 1.5rem

.text-lg.text-md, .text-sm, .text-xs

font-size:1.25rem, 1.1rem, 1rem, 0.8rem respectively

.gray-text, .gray2-text

Applies a variant of gray color text to the element.

.primary-text

Applies primary color text to the element.

.left-text, .center-text, .right-text

Aligns text to the left, center and right respectively.